<template>
  <div class="download_dingdan">
    <div class="top">
      <img src="../assets/images/download_login_03.png" alt="">
      <span>打零工</span>
      <div class="title">
        <p>一款专注于零工交易的</p>
        <p>移动应用软件</p>
      </div>
    </div>
    <div class="content">
      <img src="../assets/images/download_07.png" alt="">
      <div class="download_btn">
        <a href="javascript:void (0);"><i class="iconfont icon-ios"> iphon下载</i></a>
        <a href="javascript:void (0);"><i class="iconfont icon-android"> android下载</i></a>
      </div>
    </div>
  </div>
</template>

<script>

export default {
  name: 'download_dingdan',
  data () {
    return {
      msg: '啦啦',
    }
  },
  methods:{ }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .download_dingdan{height:560px!important;background: #fff;position: relative;overflow: hidden;}
  .top{background: #fff;text-align: center;height:40%;color:#68440a;font-size: 1rem;padding:22% 0 18% 0;}
  .top img{width:18%;}
  .top span{display: block;margin:2% 0 5% 0;}
  .top .title p:first-child{font-size: 1.2rem;margin-bottom: 2%;}
  .content{font-size: 0px;background: #ffc259;position: fixed;bottom:0;}
  .content img{width:100%;}
  .download_btn{overflow: hidden;padding:5% 0;width:100%;overflow: hidden;}
  .download_btn a{display:block;background: none;border:1px solid #fff;padding:2% 6%;color:#fff;border-radius: 22px;margin:4% 0;}
  .download_btn a .iconfont{font-size:1rem;}
  .download_btn a:first-child{float: left;margin-left: 8%;}
  .download_btn a:last-child{float: right;margin-right:8%;}
</style>
